<template>
  <a-card :bordered='false'>
    <!-- 查询区域 -->
    <div class='table-page-search-wrapper'>
      <a-form layout='inline' @keyup.enter.native='searchQuery'>
        <a-row :gutter='24'>
          <a-col :xl='6' :lg='7' :md='8' :sm='24'>
            <a-form-item label='月份'>
              <a-month-picker style='width: 100%' @change='onDateChange' placeholder='请选择月份'
                              v-model='queryParam.salTime'></a-month-picker>
            </a-form-item>
          </a-col>
          <a-col :xl='6' :lg='7' :md='8' :sm='24'>
            <span style='float: left;overflow: hidden;' class='table-page-search-submitButtons'>
              <a-button type='primary' @click='searchQuery' icon='search'>查询</a-button>
              <a-button type='primary' @click='searchReset' icon='reload' style='margin-left: 8px'>重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class='table-operator'>
      <down-load-excel
        class='down-load-excel'
        :data='cashFlowDataSource'
        :fields='jsonFields'
        type='xls'
        header='现金流量表'
        name='现金流量表.xls'
      >
        <a-button type='primary' icon='download'>导出</a-button>
      </down-load-excel>
            <a-button type="primary" icon="download" @click="download1()">导出word</a-button>
    </div>

    <!-- table区域-begin -->
    <div>
      <a-table
        ref='table'
        size='small'
        :scroll='{x:true}'
        bordered
        :rowKey='record=>{return record.key}'
        :columns='columns'
        :dataSource='dataSource'
        :pagination='false'
        :loading='loading'
        :default-expand-all-rows='true'
        :expanded-row-keys.sync='expandedRowKeys'
        @expand='handleExpand'
        @expandedRowsChange='handleExpandedRowsChange'
        class='j-table-force-nowrap'
      >
      </a-table>
    </div>
  </a-card>
</template>

<script>

import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction } from '@api/manage'
import moment from 'moment'
import { cashFlowDataSource } from './cashFlowTableData'
import { exportDocx } from '@comp/docx/docx'

export default {
  name: 'HfOperationTaxesList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {},
  data() {
    return {
      description: '税费管理管理页面',
      expandedRowKeys: [],
      jsonFields: {
        '项目': 'name',
        '行次': 'index',
        '本期金额': 'currentAmount',
        '本年累计金额': 'currentYearTotal'
      },
      cashFlowDataSource: cashFlowDataSource,
      dataSource: [
        {
          name: '一、经营活动产生的现金流量',
          key: 1,
          index: null,
          currentAmount: null,
          currentYearTotal: null,
          children: [
            {
              name: '销售产成品、商品、提供劳务收到的现金',
              key: 11,
              index: 1,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '收取的税费返还',
              key: 12,
              index: 2,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '收到的其他与经营活动有关的现金',
              key: 13,
              index: 3,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流入小计',
              key: 14,
              index: 4,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '购买原材料、商品、接受劳务支付的现金',
              key: 15,
              index: 5,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '支付的职工薪酬',
              key: 16,
              index: 6,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '支付的税费',
              key: 17,
              index: 7,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '支付的其他与经营活动有关的现金',
              key: 18,
              index: 8,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流出小计',
              key: 19,
              index: 9,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '经营活动产生的现金流量净额',
              key: 110,
              index: 10,
              currentAmount: 100,
              currentYearTotal: 2000
            }
          ]
        },
        {
          name: '二、投资活动产生的现金流量',
          key: 2,
          index: null,
          currentAmount: null,
          currentYearTotal: null,
          children: [
            {
              name: '收回短期投资、长期债券投资和长期股权投资收到的现金',
              key: 21,
              index: 11,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '取得投资收益所收到的现金',
              key: 22,
              index: 12,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '处置固定资产、无形资产和其他非流动资产收回的现金净额',
              key: 23,
              index: 13,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流入小计',
              key: 24,
              index: 14,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '短期投资、长期债券投资和长期股权投资支付的现金',
              key: 25,
              index: 15,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '购建固定资产、无形资产和其他非流动资产支付的现金',
              key: 26,
              index: 16,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流出小计',
              key: 27,
              index: 17,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '投资活动产生的现金流量净额',
              key: 28,
              index: 18,
              currentAmount: 100,
              currentYearTotal: 2000
            }
          ]
        },
        {
          name: '三、筹资活动产生的现金流量',
          key: 3,
          index: null,
          currentAmount: null,
          currentYearTotal: null,
          children: [
            {
              name: '取得借款收到的现金',
              key: 31,
              index: 19,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '吸收投资者投资收到的现金',
              key: 32,
              index: 20,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流入小计',
              key: 33,
              index: 21,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '偿还借款本金支付的现金',
              key: 34,
              index: 22,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '偿还借款利息支付的现金',
              key: 35,
              index: 23,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '分配利润支付的现金',
              key: 36,
              index: 24,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '现金流出小计',
              key: 37,
              index: 25,
              currentAmount: 100,
              currentYearTotal: 2000
            },
            {
              name: '筹资活动产生的现金流量净额',
              key: 38,
              index: 26,
              currentAmount: 100,
              currentYearTotal: 2000
            }
          ]
        },
        {
          name: '四、现金净增加额',
          key: 4,
          index: 27,
          currentAmount: null,
          currentYearTotal: null,
          children: [
            {
              name: '加：期初现金余额',
              key: 41,
              index: 28,
              currentAmount: 100,
              currentYearTotal: 2000
            }
          ]
        },
        {
          name: '五、期末现金余额',
          key: 5,
          index: 29,
          currentAmount: 5000,
          currentYearTotal: 1000000
        }
      ],
      // 表头
      columns: [
        {
          title: '项目',
          align: 'left',
          dataIndex: 'name',
          width: 600
        },
        {
          title: '行次',
          align: 'center',
          dataIndex: 'index',
          width: 50
        },
        {
          title: '本期金额',
          align: 'center',
          dataIndex: 'currentAmount'
        },
        {
          title: '本年累计金额',
          align: 'center',
          dataIndex: 'currentYearTotal'
        }
      ],
      url: {
        list: '/ps/hfPsSalary/moneyFlow',
        importExcelUrl: ''
      }
    }
  },
  created() {
  },
  computed: {
    importExcelUrl: function() {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    }
  },
  mounted() {
    this.cashFlowDataSource[0].currentAmount = 9999.999
  },
  methods: {
    moment,
    download1() {
      let data = {
        title: '11111',
        table: [
          {
            x: 1,
            changjing: '2222',
            huamoian: '11111',
            zimu: 'zimu',
            shichang :20,
            note: "beizhu "
          },
          {
            x: 2,
            changjing: '2222',
            huamoian: '11111',
            zimu: 'zimu',
            shichang :20,
            note: "beizhu "
          },
        ]
      }
      exportDocx('@/temps/flowTemp.docx', data, '测试.docx')
    },

    loadData() {
      let params = this.getQueryParams()//查询条件
      this.loading = true
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          // this.dataSource = res.result.records
        } else {
          this.$message.warning(res.message)
        }
      }).finally(() => {
        this.loading = false
      })
    },
    handleExpand(expanded, record) {
      console.log(expanded, record)
    },
    handleExpandedRowsChange(expandedRowKeys) {
      this.expandedRowKeys = expandedRowKeys
    },
    onDateChange(value) {
      console.log(moment(value).format('YYYY-MM'))
      this.queryParam.salTime = moment(value).format('YYYY-MM')
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';

.down-load-excel {
  width: 82px;
}
</style>